<script setup>
import {onMounted, ref, watch} from "vue";
import "echarts";
import {getPieOption} from "../../utils/CommonsUtil.js";


const props = defineProps({
    question:{
        type:Object,
    },
    // 1:饼图 2:柱状图
    type:{
        type:Number,
        required:true
    }
})
const chartDOM = ref()
const option = ref()


//监听类型变化
watch(() => props.type, (newVal, oldVal) => {
    option.value = getPieOption(props.question,props.type)
    chartDOM.value.setOption(option.value)
})
onMounted(() => {
    option.value = getPieOption(props.question,props.type)
    chartDOM.value.setOption(option.value)
})
</script>

<template>
    <v-chart ref="chartDOM" class="chart" :option="option" />
</template>

<style scoped>
.chart {
    height: 360px;
}
</style>